<template>
  <Row class="data-dictionary">
    <Col span="4" class="col-height100">
      <p @click="close">
        <Input v-model="projectObj.name" placeholder="请选择项目" readonly />
      </p>
      <div>
        <!-- <span style="padding-left: 10px"><Icon type="ios-arrow-down" /> <span>标准WBS</span></span>-->
        <Tree
          :data="dataTree"
          :load-data="loadData"
          @on-select-change="treeSelect"
        ></Tree>
      </div>
    </Col>
    <Col span="20" class="col-main">
      <div class="button-s">
        <Button
          type="primary"
          :to="{
            name: 'add-unit-project',
            params: { name: '新增', type: 'add', id: 1 }
          }"
          >新增</Button
        >
      </div>
      <Table border ref="selection" :columns="columns" :data="dictList">
        <template slot-scope="{ row, index }" slot="action">
          <Button
            style="color:#0099ff"
            ghost
            type="text"
            :to="{
              name: 'add-unit-project',
              params: { name: '编辑', type: 'edit', id: row.id }
            }"
            >编辑</Button
          >
          <Button
            style="color:#0099ff"
            ghost
            type="text"
            :to="{
              name: 'add-unit-project',
              params: { name: '详情', type: 'detail', id: row.id }
            }"
            >详情</Button
          >
          <Button style="color:#0099ff" ghost type="text">删除</Button>
        </template>
      </Table>
      <Page
        class="tab-page"
        :total="total"
        :current="page.current"
        :page-size="page.pageSize"
        @on-change="pageChange"
        @on-page-size-change="sizeChange"
        show-elevator
        show-sizer
        show-total
      />
    </Col>
  </Row>
</template>

<script>
import Utils from '../../common/util'
import closeTag from '../../mixins/closeTag'
export default {
  name: 'StandardLibrary',
  mixins: [closeTag],
  data() {
    return {
      total: 0,
      dataTree: [],
      columns: [
        {
          title: '序号',
          type: 'index',
          align: 'center',
          width: 100
        },
        {
          title: '名称',
          key: 'name',
          align: 'center'
        },
        {
          title: '风险等级',
          key: 'dictRiskGradeName',
          align: 'center'
        },
        {
          title: '是否为控制工程',
          key: 'dictControlEngineeringName',
          align: 'center'
        },
        {
          title: '操作',
          align: 'center',
          slot: 'action'
        }
      ],
      dictList: [],
      page: {
        currentPage: 1,
        pageSize: 10,
        whereMap: {
          projectId: '',
          name: '',
          wbsId: '',
          dictRiskGrade: 'RISK_GRADE_1',
          dictControlEngineering: 'IS_CONTROL_ENGINEERING_1'
        }
      },
      projectObj: {},
      parmes: {
        projectId: '',
        parentId: '0'
      }
    }
  },
  watch: {
    $route(to, from) {}
  },
  mounted() {
    if (this.$route.query.res) {
      this.projectObj = JSON.parse(this.$route.query.res)
      this.dataTree.push(JSON.parse(this.$route.query.res))
    }
    Utils.$on('unitEdit', () => {
      this.treeSelect()
    })
  },
  methods: {
    close() {
      if (this.$route.query.res) {
        let query = {
          res: this.$route.query.res
        }
        this.closetabQuerymeter('unit-project', query)
      } else {
        this.closetab('unit-project')
      }
      this.$router.push({ name: 'project-list' })
    },
    // 列表
    treeSelect(item) {
      console.log(666,item)
      if (item) {
        this.page.whereMap.projectId = this.projectObj.id
        this.page.whereMap.name = item[0].name
        this.page.whereMap.wbsId = item[0].wbsId
      }
      this.$api.UnitProject.unitTreeList(this.page).then(resp => {
        if (resp.code == 200) {
          this.dictList = resp.data.resultObject
          this.total = resp.data.totalRecord
        } else {
          this.$Message.warning(resp.message)
        }
      })
    },
    // 树懒加载
    loadData(item, callback) {
      
      let parmes = {
        projectId: '',
        parentId: '0'
      }
      parmes.projectId = item.id
      if (!item.isProject) {
        parmes.parentId = item.parentId
      }else{
        parmes.parentId = '0'
      }
      this.$api.UnitProject.unitTreeGetAll(parmes).then(resp => {
        if (resp.code == 200) {
          resp.data.forEach(e => {
            e.title = e.name
            if (e.isUnitChild) {
              e.children = []
              e.loading = false
            }
          })
          callback(resp.data)
        } else {
          this.$Message.warning(resp.message)
        }
      })
    },
    checkWbBtn() {},
    pageChange() {},
    sizeChange() {},
    addBtn() {}
  }
}
</script>

<style lang="scss" scoped>
.data-dictionary {
  height: calc(100% - 0px);

  .col-height100 {
    height: 100%;
    border-right: 1px solid #ebeef1;
    overflow: auto;

    p {
      padding: 10px;
    }
  }

  .col-main {
    padding: 10px;

    .button-s {
      margin-bottom: 15px;

      button {
        margin-right: 15px;
      }
    }
  }
}

.ul-list {
  list-style: none;
  //height: calc(100% - 10px);
  background-color: #ffffff;

  li {
    height: 45px;
    line-height: 45px;
    border-bottom: 1px solid #ebeef1;
    padding: 0 25px;
    cursor: pointer;
    font-size: 14px;
    //overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    position: relative;

    .tooltip {
      position: absolute;
      right: 10px;
      top: 0px;
    }

    .icon {
      color: #1e88f5;
    }

    &.active {
      color: #2d8cf0;
      box-sizing: border-box;
    }
  }

  li:hover {
    color: #2d8cf0;
  }
}
</style>
